import React, { Component } from 'react'
import axios from 'axios'
 class Movie extends Component {
  state = {
      arr:[]
  }
  componentDidMount(){
      axios.get("/list").then(res=>{
          this.setState({
            arr:res.data
          })
      })
  }
  goDetail(id){
     console.log( this.props.history,22222); // 跟路由有关得所有信息都在this.props.history里
     this.props.history.push({
         pathname:"/detail/" + id 
     })
  }
  render() {
    let {arr} = this.state
    return (

      <div>
          {
              arr && arr.length ? arr.map((item,index)=>{
                  return <div key={index} onClick={this.goDetail.bind(this,item.id)}>
                      <img src={item.img} alt="" />
                      <h4>{item.name}</h4>
                  </div>
              }):"暂无数据"
          }
      </div>
    )
  }
}

export default Movie